<!DOCTYPE HTML>
<html>
    <head>
        <title>Example</title>
        <meta name="author" content="Adam Freeman"/>
        <meta name="description" content="A simple example"/>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
        <style>
            h1, h2, h3 { background: grey; color: white; }
        
            hgroup > h1 { margin-bottom: 0px;}
        
            hgroup > h2 { background: grey; color: white; font-size: 1em; 
                          margin-top: 0px; }
        </style>
    </head>
    <body>
            <hgroup>
                <h1>Fruits I Like</h1>
                <h2>How I Learned to Love Citrus</h2>
            </hgroup>
            I like apples and oranges.
            <h2>Additional fruits</h2>
            I also like bananas, mangoes, cherries, apricots, plums, peaches and grapes.
            <h3>More information</h3>
            You can see other fruits I like <a href="fruitlist.html">here</a>.
            
            <h1>Activities I like</h1>
            <p>I like to swim, cycle and run. I am in training for my first triathlon,
            but it is hard work.</p>
            <h2>Kinds of Triathlon</h2>
            There are different kinds of triathlon - sprint, Olympic and so on.
            <h3>The kind of triathlon I am aiming for</h3>
            I am aiming for Olympic, which consists of the following:
            <ol>
                <li>1.5km swim</li>
                <li>40km cycle</li>
                <li>10km run</li>
            </ol>
    </body>
</html>
